<template>
  <view class="p-bar-wyg">
    <view class="tag">{{ middleBar.title || '无忧购' }}</view>
    <view>{{ middleBar.subtitle || '该商品已入选全网好物热销榜' }}</view>
  </view>
</template>

<script>
import { mapState } from 'vuex';

export default {
  name: 'PBarWyg',
  components: {

  },
  props: {

  },
  data() {
    return {};
  },
  computed: {
    ...mapState({
      middleBar: state => state['product'].pageModule?.middleBar || {}
    })
  },
  watch: {},
  created() {

  },
  methods: {

  }
};
</script>

<style lang="scss" scoped>
.p-bar-wyg{
  display: flex;
  align-items: center;
  background: #FFF5E8;
  font-size: 26px;
  color: #BC8855;
  padding: 20px;
  border-radius: 20px;
  margin: 0 var(--padding);
  .tag{
    color: #FFFFFF;
    background: #BC8855;
    font-size: 26px;
    padding: 8px 10px;
    border-radius: 6px;
    margin-right: 13px;
  }
}
</style>
